<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" :isDetail="true" title="用户详情">
    <Description
      title="基本信息"
      :collapseOptions="{ canExpand: true, helpMessage: '用户基本信息' }"
      :column="3"
      :data="detailData"
      :schema="detailSchema"
    />
  </BasicDrawer>
</template>
<script lang="ts">
  import { defineComponent, ref } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { Description } from '/@/components/Description/index';
  import { detailSchema } from './user.data';
  import { getDetail } from './user.api';
  export default defineComponent({
    name: 'UserDetailDrawer',
    components: { BasicDrawer, Description },
    setup() {
      const detailData = ref();
      const [registerDrawer, { setDrawerProps }] = useDrawerInner(async (data) => {
        setDrawerProps({ confirmLoading: false });
        detailData.value = await getDetail(data.record.id);
      });

      return { registerDrawer, detailData, detailSchema };
    },
  });
</script>
